.button-select {
    width: 100%;
    border: 2px solid;
    z-index: 1;
    position: relative;
}
.button-select .button-group {
    display: -webkit-flex;
    display: flex;
}

.button-select .button-group .btn {
    padding: 7px;
    cursor: pointer;
    color: #ffffff;
    width: 100%;
    border-radius: 0px;
    background: inherit;
}

.button-select .button-group .button-toggle {
    background: white;
    float: right;
    width: 50px;
    padding-top: 8px;
    text-align: center;
}

.button-select .button-dropdown {
    z-index: 1;
    z-index: 1;
    position: absolute;
    width: 100%;
    top: 38px;
    border: inherit;
    border-top: none;
}

.button-select .button-dropdown .button-item {
    width: 100%;
    display: inline-block;
    font-weight: 600;
    color: #000000;
    cursor: pointer;
    line-height: 30px;
    border-bottom: 1px solid rgba(111, 105, 105, 0.11);
    white-space: nowrap;
    background: #ffffff;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: .5rem 1rem;
    height: 40px;
    text-align: center;
}

.button-select .button-dropdown .button-item:hover {
    background: #f5f5f5;
}

.show {
    display: block;
}

.button-select.bg-info {
    background-color: @btn-info-bg;
    color: @btn-info-color;
    border-color: @btn-info-bg;
}

.button-select.bg-danger {
    background-color: @btn-danger-bg;
    color: @btn-danger-color;
    border-color: @btn-danger-bg;
}

.button-select.bg-warning {
    background-color: @btn-warning-bg;
    color: @btn-warning-color;
    border-color: @btn-warning-bg;
}

.button-select.bg-primary {
    background-color: @btn-primary-bg;
    color: @btn-primary-color;
    border-color: @btn-primary-bg;
}

.button-select.bg-default {
    background-color: @btn-default-bg;
    color: @btn-default-color;
    border-color: @btn-default-bg;
}

.button-select.bg-success {
    background-color: @btn-success-bg;
    color: @btn-success-color;
    border-color: @btn-success-bg;
}

.button-select.bg-cta {
    background-color: @btn-cta-bg;
    color: @btn-cta-color;
    border-color: @btn-cta-bg;
}

.button-select.bg-info i {
    color: @btn-info-bg;
}

.button-select.bg-warning i {
    color: @btn-warning-bg;
}

.button-select.bg-default i {
    color: @btn-default-bg;
}

.button-select.bg-success i {
    color: @btn-success-bg;
}

.button-select.bg-danger i {
    color: @btn-danger-bg;
}

.button-select.bg-primary i {
    color: @btn-primary-bg;
}

.button-select.bg-cta i {
    color: @btn-cta-bg;
}


// Button hovers
.button-select.bg-info:hover {
    background-color: darken(@btn-info-bg, 5%)
}

.button-select.bg-default:hover {
    background: darken(@btn-default-bg, 5%)
}

.button-select.bg-success:hover {
    background: darken(@btn-success-bg, 5%)
}

.button-select.bg-warning:hover {
    background: darken(@btn-warning-bg, 5%)
}

.button-select.bg-primary:hover {
    background: darken(@btn-warning-bg, 5%)
}

.button-select.bg-danger:hover {
    background: darken(@btn-danger-bg, 5%)
}

.button-select.bg-cta:hover {
    background: darken(@btn-cta-bg, 5%)
}
